<template>
      <!-- 返回上一个页面 -->
    <van-nav-bar
        title="新增地址"
        left-text="返回"
        left-arrow
        @click-left="back"
    />

    <!-- 新增表单 -->
    <!-- 新增加是，可以设置初始化值address-info，(根据插件格式跟用户信息，设置初始化) -->
    <van-address-edit
        :area-list="areaList"
        show-set-default='true'
        :area-columns-placeholder="['请选择', '请选择', '请选择']"
        :address-info="Addressinfo"
        @save="save"
    />

</template>
<script>
// 引入地区数据
import {areaList} from '@vant/area-data';
    export default {
        name:'AddressAdd',
        data() {
            return {
              areaList,
              LoginUser:this.$cookies.get('LoginUser'),
            };
        },
        // 写逻辑
        computed:{
            Addressinfo()
            {
                var name=this.LoginUser.nickname//拿到数据
                // console.log(this.LoginUser['province']);
                
                // 拿地区数据(逐级覆盖)
                var areaCode=''

                if (this.LoginUser['province']) {
                    areaCode=this.LoginUser['province'].toString();
                  
                }

                  if (this.LoginUser['city']) {
                    areaCode=this.LoginUser['city'].toString();
                  
                }

                  if (this.LoginUser['district']) {
                    areaCode=this.LoginUser['district'].toString();
                  
                }

                // 返回数据到上面模板
                return{
                    name,
                    areaCode
                }
            }
        },
        methods: {
            back()
            {
                this.$router.go(-1)
            },
            // 保存地址方法（返回的是用户填写的表单内容 ，要了解创建的功能，跟返回值）
            async save(content)
            {
                // console.log(content);
                
                // 组装数据
                var data={
                    consignee:content['name'],
                    // mobile:content['tel'],
                    mobile:content.tel,//点与括号，写法效果一样
                    code:content['areaCode'],
                    address:content['addressDetail'],
                    status:content['isDefault'] ? 1 :0,
                    userid:this.LoginUser.id
                }
                //  console.log(data);

                // 调用接口
                var result=await this.$api.AddressAdd(data)

                if(result.code==1)
                {
                    //  成功返回上一个页面
                   this.$notify({
                       type:'success',
                       message:result.msg,
                       duration:1000,
                       onClose:()=>{
                           this.$router.go(-1)
                       }
                   })
                }else
                {
                    // 失败留在当前页面(啥也不敢就行)
                    this.$notify({
                        type:'danger',
                        message:result.msg,
                        duration:1000,
                    })
                }
            }
        },
    }
</script>